<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<title>regist</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<div id="wrap">
	<div id="top_content">
		<div id="header">
			<div id="rightheader">
				<p>
					2009/11/20
					<br />
				</p>
			</div>
			<div id="topheader">
				<h1 id="title">
					<a href="#">main</a>
				</h1>
			</div>
			<div id="navigation">
			</div>
		</div>
		<div id="content">
			<p id="whereami">
			</p>
			<h1>
				注册
			</h1>
			<form action="login.html" method="post">
				<table cellpadding="0" cellspacing="0" border="0"
					   class="form_table">
					<tr>
						<td valign="middle" align="right">
							用户名:
						</td>
						<td valign="middle" align="left">
							<input type="text" class="inputgri" v-model="user.username"  />
						</td>
					</tr>
					<tr>
						<td valign="middle" align="right">
							真实姓名:
						</td>
						<td valign="middle" align="left">
							<input type="text" class="inputgri" v-model="user.realname"  />
						</td>
					</tr>
					<tr>
						<td valign="middle" align="right">
							密码:
						</td>
						<td valign="middle" align="left">
							<input type="password" class="inputgri" v-model="user.password" />
						</td>
					</tr>
					<tr>
						<td valign="middle" align="right">
							性别:
						</td>
						<td valign="middle" align="left">
							男
							<input type="radio" class="inputgri"  v-model="user.sex" value="男" checked="checked"/>
							女
							<input type="radio" class="inputgri" v-model="user.sex"  value="女"/>
						</td>
					</tr>

					<tr>
						<td valign="middle" align="right">
							验证码:
						</td>
						<td valign="middle" align="left">
							<input type="text" v-model="code" class="inputgri" />
						</td>
						<td>
							<img id="num" :src="url" />
							<a href="javascript:;" @click="getImg">换一张</a>
						</td>
					</tr>
				</table>
				<p>
					<input type="button" @click="register" class="button" value="Submit &raquo;" />
				</p>
			</form>
		</div>
	</div>
	<div id="footer">
		<div id="footer_bg">
			ABC@126.com
		</div>
	</div>
</div>
</body>
</html>
<script src="/ems_vue/js/vue.js"></script>
<script src="/ems_vue/js/axios.min.js"></script>
<script>
	var app = new Vue({
		el:"#wrap",
		data:{
			url:"",
			user:{
				sex:"男"
			},
			code:"",
		},
		methods:{
			//用来更换验证码实现
			getImg(){
				this.getSrc();
			},
			//获取验证码的
			getSrc(){
				var  _this = this;
				axios.get("http://localhost:8080/ems_vue/user/getImage?time="+Math.random()).then(res=>{
					_this.url = res.data;

				});
			},
			//用来注册用户信息
			register(){
				axios.post("http://localhost:8080/ems_vue/user/register?code="+this.code,this.user).then(res=>{
					console.log(res.data);
					if(res.data.state){
						alert(res.data.msg+",点击确定跳转至登录页面!");
						location.href="/ems_vue/login.html";
					}else{
						alert(res.data.msg);
					}
				});
			}
		},
		created(){
			//获取验证码
			this.getSrc();
		}
	})
</script>